UI/UX designing | First month journey 1 UI/UX designing | First month journey Context Although I'm skilled at coding frontend projects, I struggled with design. I used to rely on my instincts, which resulted in projects that took a lot of time to create. To improve, I decided to dedicate 30 consecutive days to learning UI/UX design. My goal was to create at least one quality design and position myself to build better websites in the future. To make the challenge more fun, I also decided to record my progress each day. Daily progress (30 consecutive days) Day 1 Learnt to create sketching. Tried applications like Concepts, SketchPad, etc. Explored a few websites and resources like Dribble, Behance, awwwards, etc. Day 2 Figma signup. Explored Figma features. Created shapes and tools. Day 3 Learnt about text in Figma. Learnt to create constraints and auto-layout frames. Resources and collaboration. UI/UX designing | First month journey 2 Day 4 First project. User flows in Figma. Day 5 Sitemaps and wireframes. Learnt creating components and variants. Day 6 Prototyping and animations. How to receive feedback. Learnt about grids and spacing. Also typography, text styles, grid styles, etc. Day 7 Studied color schemes, imagery, and iconography. Learnt to create color palette and color styles. Plugins for illustrations, icons, etc. Day 8 Creating custom icons. Forms and UI elements (basic and advanced inputs, best practices, etc.) Properties vs Variants. Day 9 Accessibility. Tools and plugins to make our design accessible. Design patterns. Mobile design best practices. Day 10 Design fidelity. UI/UX designing | First month journey 3 Learnt about effect styles. Screen designs: Home page and Product page. Started Motion and micro-interactions. Day 11 Motion and micro interactions. Learnt to create design system and interactive components. Day 12 Final designs of “Habitual” project. Introduction, Onboarding, Registration, Home and Wishlist screen. Day 13 Completed the “Habitual” project. Project handoff to a developer. Exporting designs and mockup practice. Understood how to build a website from a web design mockup. Day 14 Quickly went through the “How the Web works”, “History of Web”, HTML, CSS videos. Udemy course completion certificate. Day 15 Found a clothing brand’s mobile design to clone. Started working on the design system. Day 16 Created images styles for the project. Day 17 Completed creating styles for the project. Day 18 UI/UX designing | First month journey 4 Completed creating components and variants. Completed the Design system. Day 19 Completed Sign up, Login and Forgot password pages. Day 20 Completed the visual search page. Learnt more about using the Pen tool. Day 21 Completed creating the main page, selecting size and success page. Day 22 Stopped cloning the “Clothing brand” mobile design. Went through a few YT videos based on “Web designing using Figma”. Took notes from the Free Code Camp video. Day 23 Created a basic landing page for Gym. Discovered Ansh Mehra YouTube channel. Day 24 Quickly went through the UI-UX playlist of Ansh Mehra. Explored the resources shared by him. Day 25 Went through a few “Office hours playlist” videos. Learnt a few Figma related tips, tricks and shortcuts. Day 26 Explored design system of Uber, Amplify studio, etc. Read blogs related to Grids. UI/UX designing | First month journey 5 Decided to start creating the next design project based on the "Fitness" theme. Day 27 For inspiration, visited multiple websites that are based on gym, fitness, etc. Completed sketching the pages for the “BEFit” web design. Day 28 Completed creating the wireframes for “BEFit”. Day 29 Created design system for the “BEFit” project. Day 30 Completed the Home page and About page. Day 31 Completed the BEFit design. Successfully completed the plan to learn design for 30 (31) consecutive days and build at least one project of sufficient quality. General experience and learnings UI designing is not the same as UX designing and they both are different from Graphic designing. UI/UX design is not limited to learning color theory, typeface selection, and creating mockups for web and mobile. It encompasses much more than that. There was a time when I was asked to stay away from and spend less time on applications because they can be addictive. Little did I know that there would come a time when I would be learning the principles and techniques to make other people stay in the application for longer periods of time. Having good knowledge of layouts, etc. does help in learning and creating designs well. I understood things like 8pt grid system, etc. quickly as we developers focus on layout building.